<?php
session_start();

if(isset($_SESSION['s_username'])){
	require "../connection/connection.php";
	$proyectoId = $_GET['proyectoId'];
	$categoriaId = $_GET['categoriaId'];
	
	$queryAdjImg = "SELECT * FROM images WHERE proyectoId='$proyectoId' AND categoriaId='$categoriaId'";
	$resultAdjImg = mysql_query($queryAdjImg);

?>
<div id="errorBoxAttach"></div>
<label class="checkbox" style="margin-bottom:20px;"><b>Habilitar edición</b> <input type="checkbox" id="habilitarEdicionBtn"/></label>

<form action="phpScripts/portafolio/saveImageAction.php" enctype="multipart/form-data" id="addAttachImg" class="form-horizontal">
	<div class="control-group">
		<label class="control-label">Imágen</label>
		<input type="hidden" name="categoriaId" value="<?php echo $categoriaId ?>" />
		<input type="hidden" name="proyectoId" value="<?php echo $proyectoId ?>" />
		
		<div class="controls">
			<div class="input-append">
			   <input id="imageProyectoEditAttach" type="file" style="display:none"  name="image">
			   <input id="imageProyectoCoverEditAttach" class="input-large" type="text" required/>
			   <span class="btn" onclick="$('input[id=imageProyectoEditAttach]').click();">Examinar</span>
			   <button  type="submit" id="btnEditAttach" value="" class="btn btn-info" style="margin-left:5px;" >Aceptar</button >					   				   
			</div>
			<span class="ayuda">Recuerde que la imágen debe respetar un alto de 496px</span>					
		</div>
						 
	</div>
</form>
<script>

$(document).ready(function(){
	$('input[id=imageProyectoEditAttach]').change(function() {
	   $('#imageProyectoCoverEditAttach').val(basename($(this).val()));
	});

	controlesAttach();

	submitForm('#addAttachImg','#errorBoxAttach',reloadAttachList);
});

function controlesAttach(){
	$('#habilitarEdicionBtn').click(function(){
		$('#proyectosAdjImgCont .thumbnail').removeClass('edit');
		$('#btnEditAttach').removeClass('btn-info').addClass('btn-danger').attr('disabled',true);
		if($(this).attr("checked")){
			$('.control-btn-edit-attach').bind('click',function(){
				$('#addAttachImg').attr('action','phpScripts/portafolio/updateImageAction.php?imageId='+$(this).attr('imageId'));
				$('#btnEditAttach').removeClass('btn-info').addClass('btn-danger').attr('disabled',false);
				$('#proyectosAdjImgCont .thumbnail').removeClass('edit');
				$(this).parent().removeClass('normal').addClass('edit');
			});

			$('.control-btn-delete-attach').bind('click',function(){
				$.ajax({
					url:'phpScripts/portafolio/deleteImageAttachAction.php?imageId='+$(this).attr('imageId'),
					success:function(){
						reloadAttachList();
					}
				});
			
			});
		}else{
			$('.control-btn-edit-attach').unbind();
			$('.control-btn-delete-attach').unbind();
			$('#addAttachImg').attr('action','phpScripts/portafolio/saveImageAction.php');
			$('#btnEditAttach').val('Adjuntar').removeClass('btn-danger').addClass('btn-info').attr('disabled',false);
			$('#proyectosAdjImgCont .thumbnail').removeClass('normal');
			$(this).parent().removeClass('edit').addClass('normal');
		}
	});	
}



function reloadAttachList(){
	$('#proyectos-imagenes-adjuntas').load('phpScripts/portafolio/getImageAdjProyectoAction.php?proyectoId='+<?php echo $proyectoId?>+'&categoriaId='+<?php echo $categoriaId ?>,function(){
	});
}

</script>

<?php	
	
	
	if( mysql_num_rows($resultAdjImg) > 0){
		echo  '<ul class="thumbnails" id="proyectosAdjImgCont">';
		while($rowImjAdj = mysql_fetch_array($resultAdjImg)){
			echo	'<li>';
			echo	'	<span class="thumbnail">';			
			echo    '		<i title="Editar" class="icon-pencil control-btn-edit-attach" imageId="'.$rowImjAdj['imageId'].'"></i>';
			echo 	'		<i title="Eliminar" class="icon-remove-sign control-btn-delete-attach"  imageId="'.$rowImjAdj['imageId'].'"></i>';
			echo	'		<div><img src="../actions/getAdjImages.php?id='.$rowImjAdj['imageId'].'" width="120"/></div>';
			echo 	'	</span>';
			echo 	'</li>';
		}
		echo  '</ul">';	
	}else{
		echo 'No se encontraron imágenes adjuntas';
	}
}else{
	header ("location: ../../index.php");
}
?>